import React, { memo, useState } from "react";
import { NavBar } from "react-vant";
import { useNavigate } from "react-router";
import style from "./index.module.scss";
import { Edit } from '@react-vant/icons';
const index: React.FC = memo(() => {
  const navigate = useNavigate();
  //从本地获取address地址
  const [addressdata, setAddressdata] = useState<any>(
    JSON.parse(localStorage.getItem("address") || "[]")
  );
  console.log(addressdata);

  return (
    <div>
      <NavBar
        title="收货地址"
        leftText="返回"
        onClickLeft={() => navigate(-1)}
      />

      <div className={style.bendi}>
        <div className={style.bendi1}>
        {/* 本地数据获取渲染 */}
        <p className={style.psc}>
          <span>{addressdata.value1}</span>
          <span>{addressdata.value2}</span>
        </p>
        <p className={style.psc}>
         <span> {addressdata.value}</span>
          <span>{addressdata.value3}</span>
        </p>
      </div>
      <div className={style.bendi2}>
        <span className={style.tubiao}><Edit  /></span>
      </div>
      </div>

      <button className={style.dz} onClick={() => navigate("/xinzengdizhi",{replace:true})}>
        新增地址
      </button>
    </div>
  );
})

export default index;
